<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>微电影管理系统</title>
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/resource/static/base/images/logo.png">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/admin/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/fonts/css/font-awesome.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/ionicons/css/ionicons.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/admin/dist/css/AdminLTE.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/admin/dist/css/skins/_all-skins.min.css">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/resource/static/admin/plugins/datepicker/datepicker3.css">
    <style>
        *{
            font-family:"Microsoft YaHei";
        }
        .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th{
            vertical-align:middle;
            text-align:center;
        }

    </style>
    <style>
        .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th{
            vertical-align:middle;
            text-align:left;
        }
        .td_bd{
            font-weight:bold;
        }
    </style>
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">
    <%@ include file="../5-public/AdminSidebar.jsp" %>

    <div class="content-wrapper"  >
        <!--内容-->
        <section class="content-header">
            <h1>微电影管理系统</h1>
            <ol class="breadcrumb">
                <li><a href="#"><i class="fa fa-dashboard"></i> 会员管理</a></li>
                <li class="active">查看会员</li>
            </ol>
        </section>
        <section class="content" id="showcontent" style="height: 580px">
            <div class="row">
                <div class="col-md-12">
                    <div class="box box-primary">
                        <div class="box-header">
                            <c:choose>
                                <c:when test="${personView.personRole==1}"><h3 class="box-title">管理员详情</h3></c:when>
                                <c:otherwise><h3 class="box-title">用户详情</h3></c:otherwise>
                            </c:choose>
                        </div>
                        <div class="panel-body">
                            <form id="inform-form" enctype="multipart/form-data">
                                <input id="input_PersonId" type="text" hidden="hidden" autofocus <c:if test="${personView!=null}">value="${personView.personId}"</c:if>>
                                <div class="form-group">
                                    <label for="input_name"><span class="glyphicon glyphicon-user"></span>&nbsp;昵称</label>
                                    <input id="input_name" class="form-control" placeholder="昵称" name="name" type="text" autofocus <c:if test="${personView!=null}">value="${personView.personName}"</c:if>>
                                </div>
                                <div class="col-md-12" id="error_name"></div>
                                <div class="form-group">
                                    <label for="input_email"><span class="glyphicon glyphicon-envelope"></span>&nbsp;邮箱</label>
                                    <input id="input_email" class="form-control" placeholder="邮箱" name="email" type="email" autofocus <c:if test="${personView!=null}">value="${personView.personEmail}" </c:if>>
                                </div>
                                <div class="col-md-12" id="error_email"></div>
                                <div class="form-group">
                                    <label for="input_phone"><span class="glyphicon glyphicon-phone"></span>&nbsp;手机</label>
                                    <input id="input_phone" class="form-control" placeholder="手机" name="phone" type="text" autofocus <c:if test="${personView!=null}">value="${personView.personPhone}" </c:if>>
                                </div>
                                <div class="col-md-12" id="error_phone"></div>
                                <div class="form-group">
                                    <label for="input_face"><span class="glyphicon glyphicon-picture"></span>&nbsp;头像</label>
                                    <input id="input_face" class="form-control" name="face" type="hidden" autofocus>
                                    <c:choose>
                                        <c:when test="${personView.personImage!=null}">
                                            <img width="200" height="200" src="${pageContext.request.contextPath}/resource/static/base/person/${personView.personImage}">
                                        </c:when>
                                        <c:otherwise><img src="holder.js/100x100" class="img-responsive img-rounded"></c:otherwise>
                                    </c:choose>
                                    <input type="file" onchange="uploadImageFile1(this)" accept="image/*" class="img-responsive">

                                </div>
                                <div class="col-md-12" id="error_face"></div>
                                <div class="form-group">
                                    <label for="input_info"><span class="glyphicon glyphicon-edit"></span>&nbsp;简介</label>
                                    <c:choose>
                                        <c:when test="${personView.personIntroduction!=null}"><textarea class="form-control" rows="10" id="input_info">${personView.personIntroduction}</textarea></c:when>
                                        <c:otherwise><textarea class="form-control" rows="10" id="input_info">这只咸鱼很懒，什么都没有留下~</textarea></c:otherwise>
                                    </c:choose>

                                </div>
                                <div class="col-md-12" id="error_info"></div>
                                <input type="submit" value="保存修改" class="btn btn-success">
                            </form>
                        </div>

                    </div>
                </div>
            </div>
        </section>
        <!--内容-->
    </div>
    <footer class="main-footer">
        <div class="pull-right hidden-xs">
            <b>版本</b> 1.0
        </div>
        <strong>版权 &copy; 2017-2018 归<a href="">xxx</a>.</strong> 所有
    </footer>
    <div class="control-sidebar-bg"></div>
</div>
<script src="${pageContext.request.contextPath}/resource/static/admin/plugins/jQuery/jQuery-2.2.0.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/admin/bootstrap/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/admin/plugins/slimScroll/jquery.slimscroll.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/admin/plugins/fastclick/fastclick.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/admin/dist/js/app.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/admin/dist/js/demo.js"></script>
<%--<script src="${pageContext.request.contextPath}/resource/static/base/js/jquery-3.5.1.min.js"></script>--%>
<script src="//cdn.bootcss.com/holder/2.9.4/holder.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/admin/plugins/datepicker/bootstrap-datepicker.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/admin/plugins/datepicker/locales/bootstrap-datepicker.zh-CN.js"
        charset="UTF-8"></script>
<script>
    $(document).ready(
        function () {
            $("#inform-form").on("submit", function () {
                var name= $("#input_name").val();
                var email= $("#input_email").val();
                var phone= $("#input_phone").val();
                var introduction= $("#input_info").val();
                var id=$("#input_PersonId").val()
                var rdata={
                    "personName":name,
                    "personEmail":email,
                    "personPhone":phone,
                    "personIntroduction":introduction,
                    "personId":id
                }
                $.ajax({
                    url:"/person/toSaveView",
                    data:rdata,
                    type:"post",
                    dataType:"json",
                    success:function (res) {
                        alert(res.msg);
                        if(res.code=="200"){
                            window.location.reload();
                        }

                    },
                    error:function (e1,e2,e3) {
                        console.log(e1);
                        console.log(e2);
                        console.log(e3);
                    }
                })
                return false;
            })
        }
    )
    function uploadImageFile1(element){
        var image = element.files[0];
        var data=new FormData();
        data.append("image",image);
        data.append("role",1);
        $.ajax({
            url:"/person/upload",
            data:data,
            type:"post",
            dataType:"json",
            contentType:false,
            processData:false,
            mimeType: "multipart/form-data",
            success:function (res){
                if(res.code == 200){
                    alert("上传成功")
                    //重新加载页面，图片回显
                    if (res.code=="200"){
                        window.location.reload();
                    }
                }else{
                    alert(res.msg);
                }
            },
            error:function (){
                alert("上传失败，请稍候再试");
            }
        });
    }
</script>

</body>
</html>